<template>
	<div class="indexshow">
		<div style="width: 100%;height: 20px;background-color: #ebedf0;"></div>
		<Row style="margin-top: 20px;margin-bottom:20px;">
			<Col span="6">
			<span>年段：</span>
			<Select v-model="gradeSelect" @on-change="gradeSelectChange" style="width: 150px;">
				<Option v-for="item in gradeList" :value="item.value" :key="item.value">{{item.label}}</Option>
			</Select>
			</Col>
		</Row>
		<Row style="text-align: left;margin-top: 41px;">
			<Col span="12" style="text-align: left;">
			<span style="border-left: 5px solid #517EDB;font-size: 16px;"></span>
			<span style="font-size: 16px;font-weight: 800;margin-left: 41px;">按满分值比例设置如下三率最低比例值</span>
			</Col>
		</Row>
		<Row style="padding:35px 40px 0px 45px;">
			<Col span="24" style="text-align: center;width: 33.3%;">
			<span style="font-size: 14px;">优秀成绩比例：</span>
			<input type="text" oninput="value=value.replace(/[^\d]/g,'')" maxlength="10" v-model="excellentscore" value="excellentscore" placeholder="请输入比例" style="text-align: center;width: 25%;position: relative;height: 30px;line-height: 30px;ime-mode: inactive;"></input>
			<span>%</span>
			</Col>
			<Col span="24" style="text-align: center;width: 33.3%;">
			<span style="font-size: 14px;">及格成绩比例：</span>
			<input type="text" oninput="value=value.replace(/[^\d]/g,'')" maxlength="10" v-model="passingscore" value="passingscore" placeholder="请输入比例" style="text-align: center;width: 25%;position: relative;height: 30px;line-height: 30px;ime-mode: inactive;"></input>
			<span>%</span>
			</Col>
			<Col span="24" style="text-align: center;width: 33.3%;">
			<span style="font-size: 14px;">低分成绩比例：</span>
			<input type="text" oninput="value=value.replace(/[^\d]/g,'')" maxlength="10" v-model="lowscore" value="lowscore" placeholder="请输入比例" style="text-align: center;width: 25%;position: relative;height: 30px;line-height: 30px;ime-mode: inactive;"></input>
			<span>%</span>
			</Col>
			<Modal title="提示" v-model="confirm" :closable="false"  class-name="vertical-center-modal" @on-ok="save" @on-cancel="cancelmodel">
					<p>确定设置优秀成绩比例为{{excellentscore}}%,及格成绩比例为{{passingscore}}%,低分成绩比例为{{lowscore}}%吗？</p>
			</Modal>
			
		</Row>
		<Row style="padding:35px 40px 0px 45px;">
			<Col span="24" style="text-align: center;">
			<Button @click="confirm=true" size="large" type="primary">确定</Button>
			</Col>
		</Row>
	</div>
</template>

<script>
	import api from "@/components/js/Apidomain.js"
	import { getsessionstorage, setsessionstorage } from '@/components/js/Localstorage'
	import axios from 'axios'
	export default {
		data() {
			return {
				gradeSelect: "",
				gradeList: [],
				id:"",
				excellentscore: "",
				passingscore: "",
				lowscore: "",
				ratioList: [],
				confirm:false,
			}
		},
		computed: {

		},
		created() {
			
			this.getInitSubsectionParamSelect()
		},
		methods: {
			getInitSubsectionParamSelect: function() {
				var self = this;
				let url = api.apidomain + '/tqes/web/tchSubsectionParamDefine/getInitSubsectionParamSelect';
				this.$http.post(url, {}).then(function(response) {
						if(response.data.success == true) {
							//						console.log(response.data.data)
							self.gradeList = response.data.data.gradeNoList
							//						console.log(self.gradeList)
							if(self.gradeList.length != 0) {
								self.gradeSelect = self.gradeList[0].value;
							}
							self.findByGroadNo();
						} else if(response.data.success == false) {
							self.$Message.error({
								content: response.data.msg,
								duration: 10,
								closable: true
							});
						}
					})
					.catch(function(error) {
						self.$Message.error({
							content: '系统发生错误:错误码00295',
							duration: 10,
							closable: true
						});
					});
			},
			gradeSelectChange: function() {
				this.findByGroadNo()

			},
			findByGroadNo: function() {
				var self = this;
				let url = api.apidomain + '/tqes/web/TchThreeRateSetting//findByGroadNo/' + this.gradeSelect;
				this.$http.get(url, {}).then(function(response) {
						if(response.data.success == true) {
								console.log(response.data.data)						
							self.excellentscore= response.data.data.excellentRatio
							self.passingscore= response.data.data.passingRatio
							self.lowscore= response.data.data.lowScoreRatio
							self.id=response.data.data.id
						} else if(response.data.success == false) {
							self.$Message.error({
								content: response.data.msg,
								duration: 10,
								closable: true
							});
						}
					})
					.catch(function(error) {
						self.$Message.error({
							content: '系统发生错误:错误码00296',
							duration: 10,
							closable: true
						});
					});
			},
			save: function() {
				var self = this;
				let url = api.apidomain + '/tqes/web/TchThreeRateSetting/save';
				this.$http.post(url, {
						"id": this.id,
						"excellentRatio": this.excellentscore, //优秀率
						"passingRatio": this.passingscore, //及格率
						"lowScoreRatio": this.lowscore, //低分率
					}).then(function(response) {
						if(response.data.success == true) {
							self.$Message.success({
								content: response.data.msg,
								duration: 10,
								closable: true
							});
							self.findByGroadNo()
//							console.log(response.data.data)
//							window.location.reload();
						} else if(response.data.success == false) {
							self.$Message.error({
								content: response.data.msg,
								duration: 10,
								closable: true
							});
//							window.location.reload();
						}
					})
					.catch(function() {
						self.$Message.error({
							content: '系统发生错误：错误码00297',
							duration: 10,
							closable: true
						});
					});
			},
			cancelmodel:function(){
				this.confirm=false
				this.findByGroadNo()
			}
		},
		watch: {
		},

	}
</script>

<style lang="css" scoped>
	.indexshow>>>.ivu-select-single .ivu-select-selection {
		/*border: none;
    	border-radius: 0px*/
	}
	
	.indexshow>>>.active {
		background-color: #517EDB;
		color: white;
	}
</style>